<template>
    <div>
        <header>
            <span> <</span>    
            <div class="search">
                <i></i>
                <input type="text" placeholder="输入城市/景点/游玩主题">
            </div>
            <div class="city">
                <span>{{dom}}</span>
                <i></i>
            </div>
        </header>    
    </div>    
</template>
<script>
export default {
    data(){
        return {
             dom:null,
        }
    },
    mounted(){
        this.axios.get("static/homeData.json").then(res=>{
            this.dom=res.data.data[0].city      
        })
    }
}
</script>

<style scoped>
    header{
        width: 100%;
        height: 40px;
        background: #0ff;
        display: flex;
        justify-content: space-around;
        align-items: center;
    }
    .search{
        width: 60%;
        border-radius: 14px;
        background: #fff;
    }
    input{
        border: none;
        outline: none;
    }




</style>

